<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!doctype html>
<html lang="en">
<head>
<title>爱学习官网</title>
<meta charset="utf-8">
<meta name="viewport"
	content="width=device-width, initial-scale=1, shrink-to-fit=no">

<link href="https://fonts.googleapis.com/css?family=Rubik:300,400,500"
	rel="stylesheet">

<link rel="stylesheet" href="css/bootstrap.css">
<link rel="stylesheet" href="css/animate.css">
<link rel="stylesheet" href="css/owl.carousel.min.css">

<link rel="stylesheet" href="fonts/ionicons/css/ionicons.min.css">
<link rel="stylesheet" href="fonts/fontawesome/css/font-awesome.min.css">
<link rel="stylesheet" href="fonts/flaticon/font/flaticon.css">

<!-- Theme Style -->
<link rel="stylesheet" href="css/style.css">
</head>
<body>

	<header role="banner">

		<nav class="navbar navbar-expand-lg navbar-light bg-light">
			<div class="container">
				 <img src="images/logo.jpg" width="109px" height="78px">
				<button class="navbar-toggler" type="button" data-toggle="collapse"
					data-target="#navbarsExample05" aria-controls="navbarsExample05"
					aria-expanded="false" aria-label="Toggle navigation">
					<span class="navbar-toggler-icon"></span>
				</button>

				<div class="collapse navbar-collapse navbar-light"
					id="navbarsExample05">
					<ul class="navbar-nav mx-auto">
						<li class="nav-item"><a class="nav-link active"
							href="index2.jsp
                ">首页</a></li>



						<li class="nav-item"><a class="nav-link" href="about.jsp">关于我们</a>
						</li>
						<li class="nav-item"><a class="nav-link" href="contact.jsp">联系</a>
						</li>
					</ul>
					<ul class="navbar-nav absolute-right">

					</ul>

				</div>
			</div>
		</nav>
	</header>
	<!-- END header -->

	<section class="site-hero site-sm-hero overlay"
		data-stellar-background-ratio="0.5"
		style="background-image: url(images/big_image_2.jpg);">
		<div class="container">
			<div
				class="row align-items-center justify-content-center site-hero-sm-inner">
				<div class="col-md-12 text-center">

					<div class="mb-5 element-animate">
						<h1 class="mb-2">在线学习</h1>

					</div>

				</div>
			</div>
		</div>
	</section>
	<!-- END section -->

	<div class="site-section bg-light">
		<div class="container">
			<div class="row">

				<div class="col-md-6 col-lg-8 order-md-2 pl-lg-5">
					<div class="row">
						<div class="col-md-12 col-lg-12 mb-5">
							<div class="col-md-6 order-md-2">
								<div class="block-16">
									<figure>

										<video width="700" controls="controls">
											<source
												src="${pageContext.request.contextPath}/front/video/1.mp4">
										</video>
									</figure>
								</div>
							</div>

							<div class="pt-5">
					

								<div class="comment-form-wrap pt-5">
									<h3 class="mb-5">发表评论</h3>
									<form action="#" class="bg-light">
										<div class="form-group">
											<label for="name">姓名</label> <input type="text"
												class="form-control" id="name">
										</div>
										<div class="form-group">
											<label for="email">邮箱</label> <input type="email"
												class="form-control" id="email">
										</div>
										
										<div class="form-group">
											<label for="message">评论内容</label>
											<textarea name="" id="message" cols="30" rows="10"
												class="form-control"></textarea>
										</div>
										<div class="form-group">
											<input type="submit" value="发表"
												class="btn btn-primary">
										</div>

									</form>
								</div>
							</div>

						</div>
					</div>


				</div>
				<!-- END content -->
				<div class="col-md-6 col-lg-4 order-md-1">

					<div class="block-24 mb-5">
						<h3 class="heading">Categories</h3>
						<ul>
							<li><a href="#">Laravel <span>10</span></a></li>
							<li><a href="#">PHP <span>43</span></a></li>
							<li><a href="#">JavaScript <span>21</span></a></li>
							<li><a href="#">Python <span>65</span></a></li>
							<li><a href="#">iOS <span>34</span></a></li>
							<li><a href="#">Android <span>45</span></a></li>
							<li><a href="#">Swift <span>22</span></a></li>
						</ul>
					</div>

					<div class="block-25 mb-5">
						<div class="heading">Recent Courses</div>
						<ul>
							<li><a href="#" class="d-flex">
									<figure class="image mr-3">
										<img src="images/img_2_b.jpg" alt="" class="img-fluid">
									</figure>
									<div class="text">
										<h3 class="heading">Create cool websites using this
											template</h3>
										<span class="meta">$34</span>
									</div>
							</a></li>
							<li><a href="#" class="d-flex">
									<figure class="image mr-3">
										<img src="images/img_2_b.jpg" alt="" class="img-fluid">
									</figure>
									<div class="text">
										<h3 class="heading">Create cool websites using this
											template</h3>
										<span class="meta">$34</span>
									</div>
							</a></li>
							<li><a href="#" class="d-flex">
									<figure class="image mr-3">
										<img src="images/img_2_b.jpg" alt="" class="img-fluid">
									</figure>
									<div class="text">
										<h3 class="heading">Create cool websites using this
											template</h3>
										<span class="meta">$34</span>
									</div>
							</a></li>
						</ul>
					</div>




				</div>
				<!-- END Sidebar -->
			</div>
		</div>
	</div>




	<!-- END footer -->

	<!-- loader -->
	<div id="loader" class="show fullscreen">
		<svg class="circular" width="48px" height="48px">
			<circle class="path-bg" cx="24" cy="24" r="22" fill="none"
				stroke-width="4" stroke="#eeeeee" />
			<circle class="path" cx="24" cy="24" r="22" fill="none"
				stroke-width="4" stroke-miterlimit="10" stroke="#f4b214" /></svg>
	</div>

	<script src="js/jquery-3.2.1.min.js"></script>
	<script src="js/jquery-migrate-3.0.0.js"></script>
	<script src="js/popper.min.js"></script>
	<script src="js/bootstrap.min.js"></script>
	<script src="js/owl.carousel.min.js"></script>
	<script src="js/jquery.waypoints.min.js"></script>
	<script src="js/jquery.stellar.min.js"></script>
	<script src="js/jquery.animateNumber.min.js"></script>

	<script src="js/main.js"></script>
</body>
</html>